<div class="vh-100 d-flex justify-content-center align-items-center">
  <div class="row w-100">
    <div class="col-3 text-end">
      <div class="vr h-100 text-dark"></div>
    </div>
    <div class="col-6">
      <div
        class="d-flex flex-column gap-4 text-center text-bg-dark py-4 rounded"
      >
        <div
          class="display-5 d-inline-flex gap-3 fw-bold justify-content-center"
        >
          <span>{{ status[0] }}</span>
          <span class="mt-2">{{ status[1] }}</span>
          <span>{{ status[2] }}</span>
        </div>
        <div class="lead my-3">{{ message }}</div>
        <div class="d-flex gap-4 justify-content-center">
          <button type="button" class="btn btn-dark text-bg-dark">
            Home Page
          </button>
          <button type="button" class="btn btn-dark text-bg-dark">
            Try Again
          </button>
        </div>
      </div>
    </div>
    <div class="col-3 text-start">
      <div class="vr h-100 text-dark"></div>
    </div>
  </div>
</div>
